<template>
    <div class="common-layout">
      <el-container>
        <el-header style="background-color: white;height: 150px;"> 
            <div class="logo"  >
                <h3>医生看诊</h3>
            </div>
        </el-header>
        <el-header style="background: #4FC1B0;height: 150px;"> 
            <div class="doctorwork" style="padding-left: 30px;padding-top:30px; font-size: 30px;color:white ;font-weight: bold;">
               病案
            </div>
            <div   style="padding-left: 60px;padding-top: 20px; color:white ; font-size: 20px;font-weight: bold;">
              患者姓名：{{patientInfo.realName||''}}|  患者病历号:{{ patientInfo.caseNumber ||'' }}| 患者性别:{{ patientInfo.gender||'' }}| 患者年龄{{ patientInfo.age||'' }}
            </div>
        </el-header>
     
      <el-container style="background-color: white;">
        <el-row :gutter="24">
    <el-col :span="4"><el-button class="grid-content ep-bg-purple" @click="goToBookIndex" plain>病案首页</el-button></el-col>
    <el-col :span="4"><el-button class="grid-content ep-bg-purple" @click="goToRequest">检查申请</el-button></el-col>
    <el-col :span="4"><el-button class="grid-content ep-bg-purple" @click="goToRequestResult">检查结果查看</el-button></el-col>
    <el-col :span="4"><el-button class="grid-content ep-bg-purple" @click="goToCheckOn">门诊确诊</el-button></el-col>
    <el-col :span="4"><el-button class="grid-content ep-bg-purple" @click="goToPrescription">开设处方</el-button></el-col>
    <el-col :span="4"><el-button class="grid-content ep-bg-purple" @click="goToFee">费用查询</el-button></el-col>
  </el-row>

      </el-container>
        <el-main> 
            <RouterView/>
        </el-main>
      </el-container>
    </div>
  </template>
  <script setup name="DoctorWork">
import router from '@/router';
import { RouterView } from 'vue-router';
 
// const storage=patientStorage();
// console.log(storage.patient);
const patientInfo = JSON.parse(sessionStorage.getItem('Patient')||'{}');


const goToBookIndex = () => {
  router.push({name:'bookIndex'})
}
const goToRequest = () => {
  router.push({name:'request'})
}
const goToRequestResult = () => {
  router.push({name:'requestResult'})
}
const goToCheckOn = () => {
  router.push({name:'checkOn'})
}
const goToPrescription = () => {
  router.push({name:'prescription'})
}
const goToFee = () => {
  router.push({name:'fee'})
}
</script>
<style scoped>
.logo {
    height: 80px;
    margin-top: 30px;
    background-color: white;
    padding-top: 10px;
    padding-left: 50px;
    border-top: 1px solid black; /* 添加淡灰色边框 */
    border-bottom: 1px solid black; /* 添加淡灰色边框 */
}
.el-row {
  margin-bottom: 20px;
}
.el-row:last-child {
  margin-bottom: 0;
}
.el-col {
  border-radius: 4px;
}

.grid-content {
  border-radius: 4px;
  min-height: 36px;
  width: 170px;
  height: 50px;
 
  text-align: center;
  line-height: 70px;
  color:black;
  font-size: 15px;
  margin-left: 20px;

}
</style>

 